<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"/>
    <meta name="keywords" content=""/>
    <meta name="description" content=""/>
    <link rel="stylesheet" href="css/amazeui.min.css">
    <link rel="stylesheet" href="css/wap.css">
    <title>私信内容页</title>
</head>
<body style="background:#ececec">
<div class="pet_mian">
    <div class="pet_head">
        <header data-am-widget="header"
                class="am-header am-header-default pet_head_block">
            <div class="am-header-left am-header-nav ">
                <a href="#left-link" class="iconfont pet_head_jt_ico">&#xe601;</a>
            </div>

            <div class="pet_news_list_tag_name">小梦梦</div>
            <div class="am-header-right am-header-nav">
                <a href="javascript:;" class="iconfont pet_head_gd_ico">&#xe600;</a>
            </div>
        </header>
    </div>

    <!--<div class="pet_more_list">-->
    <!--<div class="pet_more_list_block">-->
    <!--<div class="iconfont pet_more_close">×</div>-->
    <!--<div class="pet_more_list_block">-->
    <!--<div class="pet_more_list_block_name">-->
    <!--<div class="pet_more_list_block_name_title">阅读 Read</div>-->
    <!--<a class="pet_more_list_block_line"> <i class="iconfont pet_nav_xinxianshi pet_more_list_block_line_ico">&#xe61e;</i>-->
    <!--<div class="pet_more_list_block_line_font">新鲜事</div>-->
    <!--</a>-->
    <!--<a class="pet_more_list_block_line"> <i class="iconfont pet_nav_zhangzhishi pet_more_list_block_line_ico">&#xe607;</i>-->
    <!--<div class="pet_more_list_block_line_font">趣闻</div>-->
    <!--</a>-->
    <!--<a class="pet_more_list_block_line">-->
    <!--<i class="iconfont pet_nav_kantuya pet_more_list_block_line_ico">&#xe62c;</i>-->
    <!--<div class="pet_more_list_block_line_font">阅读</div>-->
    <!--</a>-->
    <!--<a class="pet_more_list_block_line">-->
    <!--<i class="iconfont pet_nav_mengzhuanti pet_more_list_block_line_ico">&#xe622;</i>-->
    <!--<div class="pet_more_list_block_line_font">专题</div>-->
    <!--</a>-->
    <!--<a class="pet_more_list_block_line">-->
    <!--<i class="iconfont pet_nav_bk pet_more_list_block_line_ico">&#xe629;</i>-->
    <!--<div class="pet_more_list_block_line_font">订阅</div>-->
    <!--</a>-->
    <!--<a class="pet_more_list_block_line">-->
    <!--<i class="iconfont pet_nav_wd pet_more_list_block_line_ico">&#xe602;</i>-->
    <!--<div class="pet_more_list_block_line_font">专栏</div>-->
    <!--</a>-->
    <!--<div class="pet_more_list_block_name_title pet_more_list_block_line_height">服务 Service</div>-->
    <!--<a class="pet_more_list_block_line">-->
    <!--<i class="iconfont pet_nav_xinxianshi pet_more_list_block_line_ico">&#xe61e;</i>-->
    <!--<div class="pet_more_list_block_line_font">新鲜事</div>-->
    <!--</a>-->
    <!--<a class="pet_more_list_block_line">-->
    <!--<i class="iconfont pet_nav_zhangzhishi pet_more_list_block_line_ico">&#xe607;</i>-->
    <!--<div class="pet_more_list_block_line_font">趣闻</div>-->
    <!--</a>-->
    <!--<a class="pet_more_list_block_line">-->
    <!--<i class="iconfont pet_nav_kantuya pet_more_list_block_line_ico">&#xe62c;</i>-->
    <!--<div class="pet_more_list_block_line_font">阅读</div>-->
    <!--</a>-->
    <!--<a class="pet_more_list_block_line">-->
    <!--<i class="iconfont pet_nav_mengzhuanti pet_more_list_block_line_ico">&#xe622;</i>-->
    <!--<div class="pet_more_list_block_line_font">专题</div>-->
    <!--</a>-->
    <!--<a class="pet_more_list_block_line">-->
    <!--<i class="iconfont pet_nav_bk pet_more_list_block_line_ico">&#xe629;</i>-->
    <!--<div class="pet_more_list_block_line_font">订阅</div>-->
    <!--</a>-->
    <!--<a class="pet_more_list_block_line">-->
    <!--<i class="iconfont pet_nav_wd pet_more_list_block_line_ico">&#xe602;</i>-->
    <!--<div class="pet_more_list_block_line_font">专栏</div>-->
    <!--</a>-->
    <!--</div>-->
    <!--</div>-->

    <!--</div>-->
    <!--</div>-->

    <div class="pet_content pet_content_list">
        <div class="pet_sixin">

            <div class="pet_sixin_nr" id="friend">
                <!--<div class="pet_sixin_to" style="height: 50px;" >-->
                <!--<div class="pet_sixin_to_l">-->
                    <!--<img src="img/qq1.png" alt="">-->
                <!--</div>-->
                <!--<div class="pet_sixin_to_r">-->
                    <!--<div class="pet_sixin_to_r_nr">-->
                        <!--<div class="pet_sixin_to_r_nr_sj"></div>-->
                        <!--到爱尔兰印象最-->
                    <!--</div>-->
                <!--</div>-->
                <!--<div class="pet_sixin_shijian">昨天 12:19</div>-->
            </div>




            </div>


            <div class="pet_article_dowload">
                <div class="pet_article_dowload_title"></div>
                <div class="pet_article_dowload_content">
                    <div class="pet_article_dowload_triangle"></div>
                    <div class="pet_article_dowload_ico"><img src="img/footdon.png" alt=""></div>
                    <div class="pet_article_dowload_content_font">
                    </div>

                    <div class="pet_article_dowload_all">
                        <a href="###" class="pet_article_dowload_Az am-icon-apple"> App store</a>
                        <a href="###" class="pet_article_dowload_Pg am-icon-android"> Android</a>
                    </div>

                </div>


            </div>
        </div>

        <div class="pet_article_footer_info">Copyright(c)2015 PetShow All Rights Reserved</div>
    </div>
</div>
<script src="js/jquery.min.js"></script>
<script src="js/amazeui.min.js"></script>
<script src="js/chat.js"></script>
<script src="js/common.js"></script>
<script src="js/normal-config.js"></script>
<script>
    $(function () {

        // 动态计算新闻列表文字样式
        auto_resize();
        $(window).resize(function () {
            auto_resize();
        });
        $('.am-list-thumb img').load(function () {
            auto_resize();
        });
        $('.pet_article_like li:last-child').css('border', 'none');

        function auto_resize() {
            $('.pet_list_one_nr').height($('.pet_list_one_img').height());
            // alert($('.pet_list_one_nr').height());
        }

        $('.pet_article_user').on('click', function () {
            if ($('.pet_article_user_info_tab').hasClass('pet_article_user_info_tab_show')) {
                $('.pet_article_user_info_tab').removeClass('pet_article_user_info_tab_show').addClass('pet_article_user_info_tab_cloes');
            } else {
                $('.pet_article_user_info_tab').removeClass('pet_article_user_info_tab_cloes').addClass('pet_article_user_info_tab_show');
            }
        });

        $('.pet_head_gd_ico').on('click', function () {
            $('.pet_more_list').addClass('pet_more_list_show');
        });
        $('.pet_more_close').on('click', function () {
            $('.pet_more_list').removeClass('pet_more_list_show');
        });
    });

</script>
<script>
    new Global.Self({

        mounted: function () {
            var that = this;
            $('#login').click(function () {
                that.login();
            })
            var jiange = $(" <div class=\"pet_sixin\">\n" +
                "\n" +
                "            <div class=\"pet_sixin_nr\">");
            $('#friend').append(jiange);
            this.getFriend();
            this.getGroup();
        },
        //传参数获取name对应的值
        getUserId: function (name) {
            var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
            var r = window.location.search.substr(1).match(reg);
            if (r != null) return unescape(r[2]);
            return null;
        },

        //获取群组
        getGroup: function () {
            var that = this;
            var userId = this.getUserId("userId");
            Global.service.getGroup({"userId": userId}, function (data) {
                var groupList = data.result;
                for (var i = 0; i < groupList.length; i++) {

                    var onlineUser = $("<a href='privateLetter.html?g_id="+groupList[i].groupClient.id+"'><div class=\"pet_sixin_to\"  style=\"height: 50px;\">\n" +
                        "            <div class=\"pet_sixin_to_l\">\n" +
                        "                <img src=" + groupList[i].groupClient.avatar + " style=\"height: 50px;\" alt=\"\">\n" +
                        "            </div>\n" +
                        "            <div class=\"pet_sixin_to_r\">\n" +
                        "                <div class=\"pet_sixin_to_r_nr\">\n" +
                        "                <div class=\"pet_sixin_to_r_nr_sj\"></div>\n" +
                        "             " + groupList[i].groupClient.name + "    \n" +
                        "                </div>\n" +
                        "            </div>\n" +
                        "            <div class=\"pet_sixin_shijian\"></div>\n" +
                        "        </div></a>\n");
                    $('#friend').append(onlineUser);
                }

            }, function (err) {

            })
        },



        //获取好友
        getFriend: function () {
            var that = this;
            var userId = this.getUserId("userId");
            Global.service.getFriend({"userId": userId}, function (data) {
                var friendList = data.result;

                for (var i = 0; i < friendList.length; i++) {


                    var onlineUser = $("<a href='privateLetter.html?u_id="+friendList[i].friend.id+"'><div  class=\"pet_sixin_to\"  style=\"height: 50px;\">\n" +
                        "            <div class=\"pet_sixin_to_l\"  >\n" +
                        "            <img id=" + friendList[i].friend.id + "  class=\"gray\" src=" + friendList[i].friend.avatar + " style=\"height: 50px;\" alt=\"\"> \n" +
                        "            </div>\n" +
                        "            <div class=\"pet_sixin_to_r\">\n" +
                        "                <div id=" + friendList[i].friend.nick + "  class=\"pet_sixin_to_r_nr\"   >\n" +
                        "                <div class=\"pet_sixin_to_r_nr_sj\"></div>\n" +
                        "             " + friendList[i].friend.nick + "    \n" +
                        "                </div>\n" +
                        "            </div>\n" +
                        "            <div class=\"pet_sixin_shijian\"></div>\n" +
                        "        </div></a>\n");
                    $('#friend').append(onlineUser);

                }
                $('#friend img').on("click","#"+friendList[0].friend.id ,function(){
                    alert("sdf")
                })



            }, function (err) {

            })
        }

    });

</script>
<style>
    .gray {
        -webkit-filter: grayscale(100%);
        -moz-filter: grayscale(100%);
        -ms-filter: grayscale(100%);
        -o-filter: grayscale(100%);

        filter: grayscale(100%);

        filter: gray;
    }


</style>
</body>
</html>